<template>
  <div class="app-container">
    <table-list
      :action-obj="actionObj"
      :columns="columns"
      :default-data="defaultData"
      :do-add="doAdd"
      :do-edit="doEdit"
      :do-multi-delete="doMultiDelete"
      :form-items="formItems"
      :form-rules="formRules"
      :get-list="getList"
      :init-params="initParams"
      :search-obj="searchObj"
    />
  </div>
</template>

<script>
  import TableList from '@/components/TableList'
  import { getList, doAdd, doEdit, doMultiDelete } from '@/api/device'
  export default {
    components: { TableList },
    data() {
      return {
        getList,
        doAdd,
        doEdit,
        doMultiDelete,
        initParams: { spj: 1 },
        defaultData: {
          serialno: '',
          name: '',
          status: '',
          dclass: '',
          project_id: '',
          descri: '',
        },
        columns: [
          { type: 'checkbox', width: 70 },
          { type: 'seq', width: 80 },
          { field: 'serialno', title: '编号' },
          { field: 'name', title: '名称' },
          {
            field: 'user.name',
            title: '绑定用户',
            width: 100,
          },
          {
            field: 'dclass',
            title: '设备码',
            width: 100,
          },
          {
            field: 'status',
            title: '状态',
            width: 80,
            slotObj: {
              component: 'vxe-tag',
              options: [
                { label: '生效', value: 1, status: 'success' },
                { label: '失效', value: 0, status: 'error' },
              ],
            },
          },
          {
            field: 'action',
            title: '操作',
            slots: { default: 'action' },
            width: 160,
          },
        ],
        formItems: [
          {
            field: 'serialno',
            title: '编号',
            span: 12,
            itemRender: {
              name: 'VxeInput',
              props: { placeholder: '编号', clearable: true },
            },
          },
          {
            field: 'name',
            title: '名称',
            span: 12,
            itemRender: {
              name: 'VxeInput',
              props: { placeholder: '名称', clearable: true },
            },
          },
          {
            field: 'descri',
            title: '备注',
            span: 24,
            itemRender: {
              name: 'VxeTextarea',
              props: {
                placeholder: '备注',
                autosize: { minRows: 2, maxRows: 4 },
              },
            },
          },
        ],
        formRules: {
          name: [{ required: true, message: '请输入名称' }],
        },
        searchObj: {
          collapseNode: false,
          items: [
            {
              field: 'serialno',
              title: '设备编号',
              span: 4,
              itemRender: {
                name: 'VxeInput',
                defaultValue: '',
                props: { placeholder: '设备编号', clearable: true },
              },
            },
            {
              field: 'name',
              title: '名称',
              span: 4,
              itemRender: {
                name: 'VxeInput',
                defaultValue: '',
                props: { placeholder: '名称', clearable: true },
              },
            },
          ],
        },
        actionObj: {
          mode: 'copy',
          buttons: [],
        },
      }
    },
    methods: {},
  }
</script>

<style lang="scss" scoped></style>
